import React, { useState, useEffect, useLayoutEffect } from 'react'

export default function App() {
  const [msg, setMsg] = useState('hello react')
  // useEffect(() => {
  //   let i = 0
  //   while (i < 100000000) {
  //     i++
  //   }
  //   setMsg('update msg')
  // }, [])

  useLayoutEffect(() => {
    let i = 0
    while (i < 100000000) {
      i++
    }
    setMsg('update msg')
  }, [])
  return (
    <div>
      <h1>App</h1>
      {msg}
    </div>
  )
}
